<template>
    <div class="continer">
        <div class="searchBox">
            <img src="@/assets/images/sear.png" alt="">
            <input type="text" placeholder="输入城市名称或小区名称">
        </div>
        <router-link class="roomList" :to="{path: '/construction/seeing',query: {test: 666}}" tag="div" v-for="item in 5" :key="item">
            <img class="leftImg" src="@/assets/images/test2.jpg" alt="">
            <div class="right">
                <span class="span1">所在地区：北京</span>
                <span class="span1 span2">小区名称：富力城小区</span>
                <span class="span1">施工进度：</span>
                <div class="proBarBox">
                    <div class="proBar"><span class="bar"></span></div>
                    <span>60%</span>
                </div>
            </div>
        </router-link>



        <!-- 底部 -->
        <empty-tabbar></empty-tabbar>
        <tabbar></tabbar>
    </div>
</template>
<script>
import Tabbar from '@/pages/home/components/Tabbar'
import emptyTabbar from '@/pages/home/components/emptyTabbar'
export default {
    name: 'implimentation',
    components: {
        Tabbar,emptyTabbar
    }
}
</script>
<style lang="stylus" scoped>
.continer
    width 100%
    display flex
    align-items center
    flex-direction column
    .searchBox
        width 660px
        height 70px
        box-sizing border-box
        border 1px solid #333333;/*no*/
        display flex
        align-items center
        border-radius 35px
        margin-top 13px
        padding-left 18px
        overflow hidden
        margin-bottom 35px
        img 
            width 31px
            height 30px
            margin-right 22px
        input
            flex 1
            font-size 22px
    .roomList
        width 702px
        border-radius 10px
        box-shadow 0 0 10px 2px #f4f4f4
        margin-bottom 15px
        display flex
        align-items center
        justify-content center
        padding 30px 0
        .leftImg
            width 266px
            height 191px
            margin-right 20px
        .right
            display flex
            flex-direction column
            justify-content center
            .span1
                font-size 24px
                color #333333
                letter-spacing 2px
                margin-bottom 18px
            .span2
                margin-bottom 30px
            .proBarBox
                width 366px
                display flex
                align-items center
                justify-content space-between
                font-size 22px
                color #ce0021
                .proBar
                    width 294px
                    height 12px
                    border-radius 6px
                    background #ececec
                    overflow hidden
                    .bar
                        display block
                        width 60%
                        height 12px
                        background url(../../assets/images/bar.jpg)
                        border-radius 6px


</style>
